<!--
   datalist.html
   
   Copyright 2018 fuhz <fuhz@fuhz-Lenovo-XiaoXin-700-15ISK>
   
   This program is free software; you can redistribute it and/or modify
   it under the terms of the GNU General Public License as published by
   the Free Software Foundation; either version 2 of the License, or
   (at your option) any later version.
   
   This program is distributed in the hope that it will be useful,
   but WITHOUT ANY WARRANTY; without even the implied warranty of
   MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
   GNU General Public License for more details.
   
   You should have received a copy of the GNU General Public License
   along with this program; if not, write to the Free Software
   Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston,
   MA 02110-1301, USA.
   
   
-->

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="zh-cn" lang="zh-cn">

<head>
	<title>datalist</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta name="generator" content="Geany 1.32" />
    <script>
    function show_opts(name){
        var opts = document.getElementsByName(name);
        var s="id:[";
        for (var i=0;i<opts.length;i++){
            if(i==0)
                s = s + opts[i].value;
            else
                s = s +","+ opts[i].value;
        }
        s=s+"]";
        alert(s);
    }
    function remove_opt(o){
        var p=o.parentNode;
        if (confirm("确定要删除本项？"))
            p.removeChild(o);
    }
    var v=0;
    function append_opt(){
        var p = document.getElementById("group1");
        var opt=document.createElement("option");
        v+=1;
        opt.value = v;
        opt.setAttribute("name","opts");
        //opt.addEventListener("click", function(){
        //        remove_opt(this);
        //    });
        opt.onclick = function(){
                remove_opt(opt);
            };
        opt.innerHTML="append "+v;
        p.appendChild(opt);
    }
    </script>
</head>

<body>
    输入：<input type="text" name="fname"/><br/>
    <input type="button" value="submit" onclick='show_opts("opts")' /><br/>
    <input type="button" value="append" onclick='append_opt()' /><br/>
    <optgroup id="group1" label="依赖节点">
    </optgroup>
</body>

</html>
